<template>
  <div class="panel-tab__content">
    <el-form size="small" label-width="90px" @submit.prevent>
      <el-form-item label="运行间隔">
        <el-input v-model="timeDuration" clearable @change="updateTimerInfo()" />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "TimerProperties",
  props: {
    id: String,
    type: String
  },
  data() {
    return {
      timeDuration: "",
    };
  },
  watch: {
    id: {
      immediate: true,
      handler(val) {
        val && val.length && this.resetTimerInfo();
      }
    }
  },
  methods: {
    resetTimerInfo() {
      this.bpmnElement = window.bpmnInstances.bpmnElement;

      let eventDefinitions = this.bpmnElement.businessObject?.eventDefinitions;

      // 保存所有的 扩展属性字段
      this.timeDuration = "";

      if (eventDefinitions && eventDefinitions.length > 0) {
        if (eventDefinitions[0].timeDuration) {
          this.timeDuration = eventDefinitions[0].timeDuration.body;
        } else {
          // 新增时间
          let timeDurationEl = window.bpmnInstances.moddle.create('bpmn:Expression');
          timeDurationEl.body = ''; 

          eventDefinitions[0].timeDuration = timeDurationEl;

          window.bpmnInstances.modeling.updateProperties(this.bpmnElement, {
            eventDefinitions: eventDefinitions
          });
        }
      }

    },
    updateTimerInfo() {
      this.bpmnElement = window.bpmnInstances.bpmnElement;

      let eventDefinitions = this.bpmnElement.businessObject?.eventDefinitions;

      eventDefinitions[0].timeDuration.body = this.timeDuration;

      window.bpmnInstances.modeling.updateProperties(this.bpmnElement, {
        eventDefinitions: eventDefinitions
      });
    },

  }
};
</script>
